<template>
  <div id="app">
    <div id="luckysheet" style="margin:0px;padding:0px;position:absolute;width:100%;height:100%;left: 0px;top: 0px;"></div>
  </div>
</template>

<script>
import { getData } from '@/api/1';

export default {
  name: 'App',
  mounted () {
    this.$nextTick(() => {
        const options = {
            container: 'luckysheet', //luckysheet为容器id
            row: 100,
            column: 100,
            data: [
              {
                name: 'Sheet1',
                color: 'yellow',
                celldata: [
                  {
                    r: 0,
                    c: 0,
                    v: {
                      v: '0-0',
                    },
                  },
                  {
                    r: 1,
                    c: 0,
                    v: {
                      v: '1-0',
                    },
                  },
                ],
              },
            ],
        };
        luckysheet.create(options);

        setInterval(async () => {
          const { rowCount, colCount, data } = await getData();

          console.log('--------');
          console.log('行', rowCount);
          console.log('列', colCount);

          luckysheet.setRangeValue(data, {
            range: {row:[0, rowCount - 1],column:[0, colCount - 1]},
            isRefresh: true,
          });
        }, 1000);

    });
  },
}
</script>
